import Observer from '../common/Observer';
import pxmu from 'pxmu';
import { data } from 'jquery';
window.addEventListener("load", function () {
    // 创建相册功能
    let albumInput = document.getElementById("albumInput");
    let albumCreateBtn = document.getElementById("albumCreateBtn");
    let select = this.document.getElementById('select')
    console.log(select);
    console.log(albumCreateBtn);

    albumCreateBtn.onclick = function () {

        fetch('/guyun/create_album?authrization=' + localStorage.getItem("token") + "&name=" + albumInput.value)
            // .then(res => {res=typeof res==='string'?JSON.parse(res):res;console.log(res)})
            .then(res => { res.json() })
            .then(({ data, err }) => {
                if (!err) {
                    console.log(data);
                    // pxmu.loading({
                    //     msg: data.data, //loading信息 为空时不显示文本
                    //     time: 200, //停留时间 
                    //     bg: 'rgba(0, 0, 0, 0.65)', //背景色
                    //     color: '#fff', //文字颜色
                    //     animation: 'fade', //动画名 详见动画文档
                    //     close: true, // 自动关闭 为false时可在业务完成后调用 pxmu.closeload();手动关闭
                    //     inscroll: false, //模态 不可点击和滚动
                    //     inscrollbg: 'rgba(0, 0, 0, 0.45)',//自定义遮罩层颜色 为空不显示遮罩层
                    // });
                    
                    console.log('恭喜创建成功');
                    return;
                }
                pxmu.fail({
                    msg: data.data, //loading信息 为空时不显示文本
                    time: 2500, //停留时间 
                    bg: 'rgba(0, 0, 0, 0.65)', //背景色
                    color: '#fff', //文字颜色
                    animation: 'fade', //动画名 详见动画文档
                    close: true, // 自动关闭 为false时可在业务完成后调用 pxmu.closeload();手动关闭
                    inscroll: false, //模态 不可点击和滚动
                    inscrollbg: 'rgba(0, 0, 0, 0.45)',//自定义遮罩层颜色 为空不显示遮罩层
                });
            })
            .catch((error) => {
                console.log(error)
            })
    }

    var albumId;
    // 获得当前用户的所有相册
    // albumInput.onchange=function(){
    fetch('/guyun/get_albums?authrization=' + localStorage.getItem("token"))
        .then(res => res.json())
        .then(({ error, data }) => {
            if (!error) {
                console.log(Array.isArray(data));
                function getAlbumId(){
                    albumId=data.map((val,index)=>{
                        return (val["_id"],index);
                    })
                    console.log(albumId);
                }
                // getAlbumId()
                
                 
                select.innerHTML += data.map((val, index) => `<option>${data[index]['albumname']}</option>`).join("")
            }
        })
        .catch((error) => console.log(error))

        


    
    // 上传图片到指定文件夹
    let file = document.getElementById('file')
    let uploadBtn = document.getElementById('uploadBtn')

    uploadBtn.onclick = function () {
        // 用表单来初始化
        var formData = new FormData();
        // 把token加入进去
        formData.append("authrization", localStorage.getItem("token"))
        // 把相册名加入FormData实例
        formData.append("albumname", select.value);

        // 把文件加入FormData实例
        console.log(formData);
        [...file.files].forEach(function (val) {
            formData.append("file", val)
            console.log(formData.get('file'));
        })
        // let promise= new Promise((resolve,reject)=>{

        //         resolve('获取成功')

        // })
        // promise.then((upload)=>{
        //     console.log('成功');
        // })
        // .catch(()=>{console.log('有点问题')})
        // console.log(promise);


        // async function upload(){
        //         // formData.append("key", file.files[0]);
        //         const res= fetch("/guyun/upload_img", {
        //             method: "post",
        //             headers: {
        //                 "Content-type": "Multipart/form-data"
        //             },
        //             body:"authrization=" + localStorage.getItem("token") + "&albumname=" + select.value +"&file="+formData
        //         })
        //         // console.log(res);
        //         const json=await res.json()
        //         // console.log(json);
        //         // const [a,b]=await Promise.all([res,json]);
        //     } 
            
        //     upload()  

        fetch('/guyun/upload_img', {
            method: 'post',
            body: formData,
        })
        .then(res => res.data)
        .then(({ error, data }) => {
            if (!error) {
                pxmu.success(data)
            }
        })
    }

    // getAlbumId()
    // console.log(getAlbumId());
    
    
    let deleteBtn=this.document.getElementById('deleteBtn')
    select.onchange=function(){
        console.log(albumname.indexOf(data));
    }
    deleteBtn.onclick=function(){
        getAlbumId()
        
        fetch('/guyun/del_album?authrization=' + localStorage.getItem("token") + "&name=" +select.value+"id="+data.data)
        .then()
    }







 





    /* 

        // 删除相册
        // let select=this.document.getElementById('select')
    let deleteBtn=document.getElementById('deleteBtn')
    deleteBtn.onclick=function(){
        QF.get("/get_albums", {name: albumInput.value, authrization: localStorage.getItem("token")}, function(data) {
            console.log('get到了');
            select.innerHTML = data.data.map(val => `<option>${val}</option>`).join("")
        
            console.log(select);
            QF.get("/delete_album", {name: albumInput.value, authrization: localStorage.getItem("token")},function(data){
                console.log(albumInput.value);
                console.log('进入delete');
                // if(data.error===0){
                    console.log(data.data);
                   
                    select.onchange=function(){
                        console.log('删除成功le');
    
                        let albumArr=data.data;
                        delete albumArr.indexOf(select.value)
                        console.log('删除成功');
                        // console.log(data.data.indexOf(select.value));
                       
                    // }
                    
                }
            })
        })
       
        
    }
    
    
    
    
    
    // 展示我的作品
    let myWork=this.document.getElementById('myWork');
    console.log(myWork);
    myWork.onclick=function(){
        QF.get("/get_albums", {name: albumInput.value, authrization: localStorage.getItem("token")}, function(data,err) {
            if(!err){
                console.log(data.data);
                QF.get('/show_album',{name: albumInput.value,authrization: localStorage.getItem("token")}, function(data){
                    console.log(data);
                })
            }
            
        })
    
        
    } */



})

